<template>
    <div class="dashboard-container" ref="homeRef">
      <!-- 窗口一 -->
      <div v-if="showWindowBox1" :class="classNameIndex == 0 ? 'areaBoxACTIVE' : 'areaBox'" @click="xianshiFirst">
        <!-- <img class="zhizhen" v-if="classNameIndex == 0" src="../../assets/rightFlag.png" height="40" width="60" alt=""
          style="position: absolute;z-index:1000000000;left:-60px;"> -->
        <div class="close" @click="closeW1" title="关闭窗口"><i class="el-icon-close"></i></div>
        <div v-if="show1">
          <!-- <el-breadcrumb v-if="firstArr" class="menuInfoList" separator-class="el-icon-arrow-right">
            <el-breadcrumb-item v-for="(item, index) in firstArr" :key="index">{{ item }}</el-breadcrumb-item>
          </el-breadcrumb> -->
          <div class="menuInfoList"></div>
        </div>
        <div id="bgPhone">
          <!-- <keep-alive> -->
          <component class="zujian" ref="firstBox" :sendData="sendData" type="1" :is="dynComponent"></component>
          <!-- </keep-alive> -->
          <!-- <component class="zujian" ref="firstBox" :sendData="sendData" type="1" :is="dynComponent"></component> -->
        </div>
      </div>
    </div>
  </template>
  
  <script>
  import { mapGetters } from "vuex";
  // 窗口一
  // const yanggb = () => import('@/mainComponents/weChat/wechat')
  import weChat from "../mainComponents/weChat/wechat";
  import baseInfo from "../mainComponents/baseInfo/sms/smsList.vue";
  import album from "../mainComponents/photoAlbum/index.vue";
  import videoInfoList from "../mainComponents/videoInfoList/index.vue";
  import audioList from "../mainComponents/audioList/index.vue";
  import first from "./first.vue";
  import callRecords from "../mainComponents/baseInfo/callRecords/index.vue";
  import contact from "../mainComponents/baseInfo/contact/index.vue";
  import memorandum from "../mainComponents/baseInfo/memorandum/index.vue";
  import qqChat from '../mainComponents/qq/qqChat.vue'
  import email from '../mainComponents/email/index.vue'
  import borwser from '../mainComponents/browser/tableTemplate.vue'
  import otherAppChat from '../mainComponents/otherApp/index.vue'
  import mapCar from '../mainComponents/map/map_car.vue'
  import transfer from "../mainComponents/weChat/transfer.vue"
  import weChatposition from "../mainComponents/weChat/position.vue"
  import note from '../mainComponents/baseInfo/notes/index.vue'
  import netdisc from "../mainComponents/netdisc/baidu.vue"
  import tikTok from "../mainComponents/tikTok/index.vue"
  import sinaWeibo from "../mainComponents/sinaWeibo/index.vue"
  import alipay from '../mainComponents/alipay/index.vue'
  import explore from '../mainComponents/explore/index.vue'
  import tantan from '../mainComponents/tantan/index.vue'
  import momo from '../mainComponents/momo/index.vue'
  import wifiPz from '../mainComponents/baseInfo/wifi/index.vue'
  import wxVideo from '../mainComponents/weChat/video.vue'
  import wxAudio from '../mainComponents/weChat/audio.vue'
  import wxAlbum from '../mainComponents/weChat/photoAlbum/index.vue'
  import wxFile from '../mainComponents/weChat/fileList.vue'
  import recycleBin from '../mainComponents/recycleBin/index.vue'
  import vpn from '../mainComponents/vpn/index.vue'
  import vpnHistory from '../mainComponents/vpn/history.vue'
  import tableProcess from '../mainComponents/basePhone/table/index.vue'
  import contentPhone from '../mainComponents/basePhone/content/index.vue'
  import CPUPhone from '../mainComponents/basePhone/CPU/index.vue'
  import gpsInfo from '../mainComponents/basePhone/GPS/index.vue'
  import diskStatus from '../mainComponents/basePhone/diskStatus/index.vue'
  import guazai from '../mainComponents/basePhone/guazai/index.vue'
  import Battery from '../mainComponents/basePhone/batteryInformation/index.vue'
  import Bluetooth from '../mainComponents/basePhone/proofBaseList/index.vue'
  import inputtingMethod from '../mainComponents/basePhone/inputtingMethod/index.vue'
  import userAccount from '../mainComponents/basePhone/userAccount/index.vue'
  import autoPass from '../mainComponents/basePhone/autoPass/index.vue'
  import saveInfo from '../mainComponents/basePhone/saveInfo/index.vue'
  import userPass from '../mainComponents/basePhone/userPass/index.vue'
  import Biofingerprint from '../mainComponents/basePhone/Biofingerprint/index.vue'
  import host from '../mainComponents/basePhone/host/index.vue'
  import phoneDetail from '../mainComponents/basePhone/phoneDetail/index.vue'
  import temperature from '../mainComponents/basePhone/temperature/index.vue'
  import proofInfo from '../mainComponents/basePhone/proofInfo/index'
  import playVideo from '../mainComponents/playVideo/index.vue'
  import stockAPP from '../mainComponents/stockAPP/index'
  import newOtherApp from '../mainComponents/newOtherApp/index.vue'
  import DJ from '../mainComponents/DJ/index.vue'
  import qqSync from '../mainComponents/qqSync/index.vue'
import { bus } from '../../main.js';
  
  export default {
    name: "proofAnalyze",
    components: {
      weChat,
      baseInfo,
      album,
      videoInfoList,
      audioList,
      first,
      callRecords,
      contact,
      memorandum,
      qqChat,
      email,
      borwser,
      otherAppChat,
      mapCar,
      transfer,
      weChatposition,
      note,
      netdisc,
      tikTok,
      sinaWeibo,
      alipay,
      explore,
      tantan,
      momo,
      wifiPz,
      wxVideo,
      wxAudio,
      wxAlbum,
      wxFile,
      recycleBin,
      vpn,
      vpnHistory,
      tableProcess,
      contentPhone,
      CPUPhone,
      gpsInfo,
      diskStatus,
      guazai,
      Battery,
      Bluetooth,
      inputtingMethod,
      userAccount,
      userPass,
      autoPass,
      saveInfo,
      Biofingerprint,
      host,
      phoneDetail,
      temperature,
      proofInfo,
      playVideo,
      stockAPP,
      newOtherApp,
      DJ,
      qqSync,
    },
    computed: {
      ...mapGetters(["name"]),
    },
    data() {
      return {
        showWindowBox1: true,
        showWindowBox2: true,
        showWindowBox3: true,
        show1: true,
        show2: true,
        show3: true,
        firstLabel: '',
        firstClass: '',
        secondClass: '',
        threeClass: '',
        menuListLogo: {
          "QQ": ["QQ", "qq.png"],
          "WeChat": ["微信", "wechat.png"],
          "chat_alipay": ["支付宝", "alipay.png"],
          "mailqq": ["QQ邮箱", "com.tencent.androidqqmail.png"],
          "mail139": ["139邮箱", "cn.cj.pe.png"],
          "mail189": ["189邮箱", "com.corp21cn.mail189.png"],
          "mailAsiaInfo": ["沃邮箱", "com.asiainfo.android.png"],
          "mailchat": ["邮洽邮箱", "cn.mailchat.png"],
          "netbase": ["网易邮箱", "com.netease.mobimail.png"],
          "netbase_master": ["网易邮箱大师", "com.netease.mail.png"],
          "chat_boss": ["BOSS直聘", "com.hpbr.bosszhipin.png"],
          "chat_bujiu": ["不就", "com.iksocial.queen.png"],
          "chat_sugar5": ["SUGAR苏格", "club.sugar5.app.png"],
          "chat_uki": ["Uki", "cn.neoclub.uki.png"],
          "chat_hezi": ["赫兹", "com.immomo.vchat.png"],
          "chat_huazhi": ["花吱", "com.huayin.hualian.png"],
          "chat_yemao": ["夜猫/快聊", "com.jsd.yemao.png"],
          "chat_driftbottle": ["恋爱漂流瓶", "com.driftbottle.app.png"],
          "chat_kuaishou": ["快手极速版", "com.kuaishou.nebula.png"],
          "chat_momo": ["陌陌", "com.immomo.momo.png"],
          "chat_qingyu": ["轻语", "com.duowan.xunhuan.png"],
          "chat_yiguan": ["一罐", "club.jijigugu.yiguan.png"],
          "chat_peini": ["陪你", "com.im.xhj.android.png"],
          "chat_xingshi": ["幸识", "com.cijianlink.cjlk.png"],
          "chat_fujinyuehui": ["附近约会", "com.leeboo.fjyue.png"],
          "chat_shidian": ["十点聊天", "com.bingo.yeliao.png"],
          "chat_shengba": ["声吧交友", "cn.tantady.tt.png"],
          "chat_virtuallover": ["虚拟恋人", "cn.dylovemm.csyh.png"],
          "chat_paipai": ["派派", "com.ifreetalk.ftalk.png"],
          "chat_xiaoqingshu": ["小情书婚恋交友", "com.jiaren.banlv.png"],
          "chat_miliao": ["密聊交友", "com.jiaren.banlv.png"],
          "chat_yingtao": ["樱桃聊天交友", "com.cherry.chat.png"],
          "chat_huohua": ["火花", "com.huohua.android.png"],
          "chatskype": ["Skype", "com.skype.raider.png"],
          "sinamicroblog": ["新浪微博", "com.sina.weibo.png"],
          "chattaqu": ["他趣", "com.xingjiabi.shengsheng.png"],
          "chattantan": ["探探", "com.p1.mobile.putong.png"],
          "baidunetdisk": ["百度网盘", "baidunetdisk.png"],
          "douyinlite": ["抖音极速版", "com.ss.android.ugc.aweme.lite.png"],
          "chattantanlite": ["探探极速版", "com.p1.mobile.light.png"],
          "chatgreatdetective": ["百变大侦探", "com.mszmapp.detective.png"],
          "chatyouer": ["右耳", "com.yunfeng.re.png"],
          "chatyuehuiba": ["约会吧", "com.youyuan.yhb.png"],
          "chatyidui": ["伊对", "me.yidui.png"],
          "chathongxian": ["红线相亲", "com.youyue.hx.png"],
          "chatyanliao": ["颜聊", "com.VideoCall.GuangShu.png"],
          "chatjiayuan": ["世纪佳缘", "com.jiayuan.png"],
          "chatquyuehui": ["趣约会", "com.quyue.android.png"],
          "chattongchengaihui": ["同城爱会", "com.mm.tutu.png"],
          "yy": ["YY", "com.duowan.mobile.png"],
          "DJI_GO": ["大疆", "dji.go.v5.png"],
          "me": ["ME", "com.yy.ourtimes.png"],
          "ppLive": ["PP约玩", "com.lizhi.pplive.png"],
          "vchat": ["V聊", "com.vliao.vchat.png"],
          "douyin": ["抖音", "com.ss.android.ugc.aweme.png"],
          "mixiong": ["蜜熊", "com.mi.xiong.png"],
          "chatlika": ["哩咔", "com.ourydc.yuebaobao.png"],
          "lianxin": ["连信", "com.zenmen.palmchat.png"],
          "meiliao": ["美聊", "com.meiliao.mlfsb.png"],
          "xiaomiliao": ["米聊", "com.xiaomi.channel.png"],
          "aihuishou": ["爱回收", "aihuishou.aihuishouapp.png"],
          "eastmoney": ["东方财富股票", "com.eastmoney.android.berlin.png"],
          "duiyuan": ["对缘", "com.lingxi.cupid.png"],
          "huixuangu": ["会选股", "com.baidao.silver.png"],
          "jiaoliao": ["娇聊", "com.mm.jiaoliao.png"],
          "jiuliao": ["就聊", "com.julun.jiuliao.png"],
          "kailiao": ["开聊", "com.moyou.png"],
          "XiuSeAiLiao": ["秀色爱聊视频交友", "com.ailiao.yuehui.png"],
          "milian": ["秘恋", "com.milian.jiaoyouba.png"],
          "moliao": ["陌聊同城速配交友", "com.tongchengsupei.mtyh.png"],
          "gdmap": ["高德地图", "com.autonavi.minimap.png"],
          "bdmap": ["百度地图", "com.baidu.BaiduMap.png"],
          "explorer_360": ["360浏览器", "360browser.png"],
          "explorer_Baidu_Browser": ["百度浏览器", "baidubrowser.jpg"],
          "explorer_Baidu_SearchBox": ["百度", "baidu.png"],
          "explorer_Baidu_SearchBox_Lite": ["百度极速版", "baidulite.jpg"],
          "explorer_Chrome": ["Chrome", "chromebrowser.png"],
          "explorer_firefox": ["Firefox", "firefoxbrowser.png"],
          "explorer_QQ": ["QQ浏览器", "qqbrowser.png"],
          "explorer_quark": ["夸克浏览器", "quarkbrowser.jpg"],
          "explorer_uc": ["UC浏览器", "ucbrowser.png"],
          "Contact": ['通讯录'],
          "SMS": ['短信'],
          "CallRecords": ['通话记录'],
          "Notes": ['便签'],
        },
        sendData: null,
        sendData1: null,
        sendData2: null,
        componentItem1: '',
        componentItem2: '',
        componentItem3: '',
        index: 0,
        classNameIndex: 0,
        dynComponent: "first",
        dynComponent2: "second1",
        dynComponent3: "three2",
        ModalText: "Content of the modal",
        confirmLoading: false,
        // 窗口一数组
        arr: [
        ],
        // 窗口二数组
        arr2: [
        ],
        // 窗口三数组
        arr3: [
        ],
        firstMenuData: '',
        secondMenuData: '',
        threeMenuData: '',
        firstModel: '',
        secondModel: '',
        threeModel: '',
        firstArr: [],
        secondArr: [],
        threeArr: [],
      };
    },
    mounted() {
      this.xianshiFirst();
    },
    created() {
      // bus.$on('data-event', (data) => {
      //   console.log(123)
      //   // 处理接收到的数据
      // this.qiehuan();

      // });
      this.closeW1()
      console.log('v1.0.0')
      this.qiehuan();
    },
    computed: {
    },
    watch: {
      // 监听左侧菜单栏操作
      '$store.state.account.viewsStatus': function () {
        this.qiehuan();
      },
      // 监听标记函数变化
      '$store.state.account.orderdata': function () {
        this.qiehuan();
      },
    },
    methods: {
  
      closeW1() {
        this.dynComponent = 'first';
        sessionStorage.setItem('item1', 'first');
        sessionStorage.removeItem('model');
        sessionStorage.removeItem('arr');
        this.show1 = false;
      },
      closeW2() {
        this.dynComponent2 = 'second1';
        sessionStorage.setItem('item2', 'second1');
        sessionStorage.removeItem('model');
        sessionStorage.removeItem('arr');
        this.show2 = false;
      },
      closeW3() {
        this.dynComponent3 = 'three2';
        sessionStorage.setItem('item3', 'three2');
        sessionStorage.removeItem('model');
        sessionStorage.removeItem('arr');
        this.show3 = false;
      },
      init() {
        if (sessionStorage.getItem('index') !== null) {
          this.classNameIndex = sessionStorage.getItem('index');
        }
        if (sessionStorage.getItem('item1') !== null) {
          this.dynComponent = sessionStorage.getItem('item1');
        }
        if (sessionStorage.getItem('item2') !== null) {
          this.dynComponent2 = sessionStorage.getItem('item2');
        }
        if (sessionStorage.getItem('item3') !== null) {
          this.dynComponent3 = sessionStorage.getItem('item3');
        }
      },
      // 选择{{$t('wechat.space1')}}
      xianshiFirst() {
        sessionStorage.setItem("area", "0");
        this.classNameIndex = 0;
        sessionStorage.setItem('index', 0)
      },
      // 选择{{$t('wechat.space1')}}
      xianshiSecond() {
        sessionStorage.setItem("area", "1");
        this.classNameIndex = 1;
        sessionStorage.setItem('index', 1)
      },
      // 选择$t('wechat.space3')
      xianshiThree() {
        sessionStorage.setItem("area", "2");
        this.classNameIndex = 2;
        sessionStorage.setItem('index', 2)
      },
      qiehuan() {
  
        if (sessionStorage.getItem("area") == 0) {
          this.chooseType();
        }
        if (this.index > 3) {
          this.index == 0;
        } else {
          this.index++;
        }
      },
      chooseType() {
        this.firstClass = '';
        let modelText = sessionStorage.getItem('model'),
          nodeData = JSON.parse(sessionStorage.getItem('sumData'));
  
        console.log(modelText,nodeData)
        if (nodeData.navigation_list) {
          this.firstArr = nodeData.navigation_list;
          this.show1 = true;
        } else if (sessionStorage.getItem('arr')) {
          let arrHome = sessionStorage.getItem('arr').split(',')
          this.firstArr = arrHome;
          this.show1 = true;
        } else {
          this.firstArr = [];
          this.show1 = false;
        }
        if (modelText == 'wechat') {
          this.dynComponent = 'weChat';
          this.$store.commit('SET_WECHAT', Date.parse(new Date()));
          this.sendData = nodeData;
          sessionStorage.setItem('item1', 'wechat');
        } else if (modelText == "wifi") {
          this.dynComponent = 'wifiPz';
          this.$store.commit('SET_WECHAT', Date.parse(new Date()));
          this.sendData = nodeData;
          sessionStorage.setItem('item1', 'wifiPz');
        }
  
        else if (modelText == "WXvideo") {
          this.dynComponent = 'wxVideo';
          this.$store.commit('SET_WECHAT', Date.parse(new Date()));
          this.sendData = nodeData;
          sessionStorage.setItem('item1', 'wxVideo');
        }
        else if (modelText == "WXaudio") {
          this.dynComponent = 'wxAudio';
          this.$store.commit('SET_WECHAT', Date.parse(new Date()));
          this.sendData = nodeData;
          sessionStorage.setItem('item1', 'wxAudio');
        }
        else if (modelText == "WXimg") {
          this.dynComponent = 'wxAlbum';
          this.$store.commit('SET_WECHAT', Date.parse(new Date()));
          this.sendData = nodeData;
          sessionStorage.setItem('item1', 'wxAlbum');
        }
        else if (modelText == "WXfile") {
          this.dynComponent = 'wxFile';
          this.$store.commit('SET_WECHAT', Date.parse(new Date()));
          this.sendData = nodeData;
          sessionStorage.setItem('item1', 'wxFile');
        }
        else if (modelText == 'qq' || modelText == "tim" || modelText == "qqlite" || modelText == "qqhd") {
          this.dynComponent = 'qqChat';
          this.$store.commit('SET_WECHAT', Date.parse(new Date()));
          this.sendData = nodeData;
          sessionStorage.setItem('item1', 'qqChat');
        }
        else if (modelText == 'contact') {
          this.dynComponent = 'contact';
          this.$store.commit('SET_CONTACT', Date.parse(new Date()));
          this.sendData = nodeData;
          sessionStorage.setItem('item1', 'contact');
        }
        else if (modelText == "sms") {
          this.dynComponent = 'baseInfo';
          this.$store.commit('SET_SMS', Date.parse(new Date()));
          this.sendData = nodeData;
          sessionStorage.setItem('item1', 'baseInfo');
        }
        else if (modelText == "callrecords") {
          console.log('777')
          this.dynComponent = 'callRecords';
          this.$store.commit('SET_CALLRECORDS', Date.parse(new Date()));
          this.sendData = nodeData;
          sessionStorage.setItem('item1', 'callRecords');
        } else if (modelText == "other_app" && nodeData.class !== "抖音" && nodeData.class !== "抖音极速版" && nodeData.class !== "新浪微博" && nodeData.class !== '他趣' && nodeData.class !== '支付宝' && nodeData.class !== '探探' && nodeData.class !== "陌陌") {
          this.dynComponent = 'otherAppChat';
          this.$store.commit('SET_OTHER', Date.parse(new Date()));
          this.sendData = nodeData;
          sessionStorage.setItem('item1', 'otherAppChat');
        } else if (modelText == "map_car") {
          this.dynComponent = 'mapCar';
          this.$store.commit('SET_MAPCAR', Date.parse(new Date()));
          this.sendData = nodeData;
          sessionStorage.setItem('item1', 'mapCar')
        } else if (modelText == "map_gpsinfo") {
          this.dynComponent = 'mapCar';
          this.$store.commit('SET_MAPCAR', Date.parse(new Date()));
          this.sendData = nodeData;
          sessionStorage.setItem('item1', 'mapCar');
        } else if (modelText == "map_searchkey") {
          this.dynComponent = 'mapCar';
          this.$store.commit('SET_MAPCAR', Date.parse(new Date()));
          this.sendData = nodeData;
          sessionStorage.setItem('item1', 'mapCar');
        } else if (modelText == "map_searchline") {
          this.dynComponent = 'mapCar'
          this.$store.commit('SET_MAPCAR', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'mapCar')
        } else if (modelText == 'map_gpsrecord') {
          this.dynComponent = 'mapCar'
          this.$store.commit('SET_MAPCAR', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'mapCar')
        }
        // CacheRecycle
        else if (modelText == "Photo") {
          this.dynComponent = 'album'
          this.$store.commit('SET_PHOTO', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'album')
        }
        else if (modelText == "CacheRecycle") {
          this.dynComponent = 'recycleBin'
          this.$store.commit('SET_PHOTO', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'recycleBin')
        }
        else if (modelText == "email") {
          this.dynComponent = 'email'
          this.$store.commit('SET_EMAIL', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'email')
        }
        else if (modelText == "Audio") {
          this.dynComponent = 'audioList'
          this.$store.commit('SET_AUDIO', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'audioList')
        } else if (modelText == "Video") {
          this.dynComponent = 'videoInfoList'
          this.$store.commit('SET_VADIO', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'videoInfoList')
        }
        // 浏览器
        else if (modelText == "browser_account" || modelText == "browser_bookmark" || modelText == "browser_history" || modelText == "browser_searchhistory" || modelText == "browser_download") {
          this.dynComponent = 'borwser'
          this.$store.commit('SET_BROWSER', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'borwser')
        }
        else if (modelText == "transfer") {
          this.dynComponent = 'transfer'
          this.$store.commit('SET_TRANSFER', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'transfer')
        }
        else if (modelText == "position") {
          this.dynComponent = 'weChatposition'
          this.$store.commit('SET_POSITION', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'weChatposition')
        }
        else if (modelText == "note") {
          this.dynComponent = 'note'
          this.$store.commit('SET_NOTE', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'note')
        }
        else if (modelText == "netdisk") {
          this.dynComponent = 'netdisc'
          this.$store.commit('SET_NRTDISC', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'netdisc')
        }
        else if ((nodeData.class == "抖音" || nodeData.class == "抖音极速版") && modelText == 'other_app') {
          this.dynComponent = 'tikTok'
          this.$store.commit('SET_TIKTOK', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'tikTok')
        }
        else if (nodeData.class == "新浪微博" && modelText == 'other_app') {
          this.dynComponent = 'sinaWeibo'
          this.$store.commit('SET_SINAWEIBO', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'sinaWeibo')
        }
        else if (nodeData.class == "支付宝" && modelText == 'other_app') {
          this.dynComponent = 'alipay'
          this.$store.commit('SET_ALIPAY', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'alipay')
        }
        else if (nodeData.label == "访问记录") {
          this.dynComponent = 'vpnHistory'
          this.$store.commit('SET_VPNHISTROY', Date.parse(new Date()));
          this.sendData = nodeData;
          sessionStorage.setItem('item1', 'vpnHistory')
        }
        else if (nodeData.APP_TYPE == "VPN" && nodeData.account_id) {
          this.dynComponent = 'vpn'
          this.$store.commit('SET_VPN', Date.parse(new Date()));
          this.sendData = nodeData;
          sessionStorage.setItem('item1', 'vpn')
        }
        else if (nodeData.class == "他趣" && modelText == 'other_app') {
          this.dynComponent = 'explore'
          this.$store.commit('SET_EXPLORE', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'explore')
          // 统一展示 otherapp
          // this.dynComponent='otherAppChat'
          // this.$store.commit('SET_OTHER',Date.parse(new Date()))
          // this.sendData=nodeData
          // sessionStorage.setItem('item1','otherAppChat')
        }
        else if (nodeData.class == "探探" && modelText == 'other_app') {
          this.dynComponent = 'tantan'
          this.$store.commit('SET_TANTAN', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'tantan')
        }
        else if (nodeData.class == "陌陌" && modelText == 'other_app') {
          this.dynComponent = 'momo'
          this.$store.commit('SET_MOMO', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'momo')
        }
        // 原版
        // else if(nodeData.class=="stockAPP"){
        //   this.dynComponent='stockAPP'
        //   this.$store.commit('SET_STOCKAPP',Date.parse(new Date()))
        //   this.sendData=nodeData
        //   sessionStorage.setItem('item1','stockAPP')
        // }
        // else if (nodeData.class == "stockAPP") {
        //   this.dynComponent = 'DJ'
        //   this.$store.commit('SET_STOCKAPP', Date.parse(new Date()))
        //   this.sendData = nodeData
        //   sessionStorage.setItem('item1', 'DJ')
        // }
        //--------------------手机基础信息----------------------
  
        else if (nodeData.class == "process") {
          this.dynComponent = 'tableProcess'
          this.$store.commit('SET_BASEPHONE', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'tableProcess')
        }
        else if (nodeData.class == 'hardware_properties') {
          this.dynComponent = 'temperature'
          this.$store.commit('SET_BASEPHONE', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'temperature')
        }
        else if (nodeData.class == "content") {
          this.dynComponent = 'contentPhone'
          this.$store.commit('SET_BASEPHONE', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'contentPhone')
        }
        else if (nodeData.class == "cpu") {
          this.dynComponent = 'CPUPhone'
          this.$store.commit('SET_BASEPHONE', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'CPUPhone')
        }
        else if (nodeData.class == "GPS") {
          this.dynComponent = 'gpsInfo'
          this.$store.commit('SET_BASEPHONE', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'gpsInfo')
        }
        else if (nodeData.class == "diskstats") {
          this.dynComponent = 'diskStatus'
          this.$store.commit('SET_BASEPHONE', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'diskStatus')
        }
        else if (nodeData.class == "mount") {
          this.dynComponent = 'guazai'
          this.$store.commit('SET_BASEPHONE', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'guazai')
        }
        else if (nodeData.class == "battery") {
          this.dynComponent = 'Battery'
          this.$store.commit('SET_BASEPHONE', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'Battery')
        }
        else if (nodeData.class == "bluetooth_manager") {
          this.dynComponent = 'Bluetooth'
          this.$store.commit('SET_BASEPHONE', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'Bluetooth')
        }
        else if (nodeData.class == "input_method") {
          this.dynComponent = 'inputtingMethod'
          this.$store.commit('SET_BASEPHONE', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'inputtingMethod')
        }
        else if (nodeData.class == "account") {
          this.dynComponent = 'userAccount'
          this.$store.commit('SET_BASEPHONE', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'userAccount')
        }
        else if (nodeData.class == "autofill") {
          this.dynComponent = 'autoPass'
          this.$store.commit('SET_BASEPHONE', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'autoPass')
        }
        else if (nodeData.class == "df") {
          this.dynComponent = 'saveInfo'
          this.$store.commit('SET_BASEPHONE', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'saveInfo')
        }
        else if (nodeData.class == "lock_settings") {
          this.dynComponent = 'userPass'
          this.$store.commit('SET_BASEPHONE', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'userPass')
        }
        else if (nodeData.class == "fingerprint") {
          this.dynComponent = 'Biofingerprint'
          this.$store.commit('SET_BASEPHONE', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'Biofingerprint')
        }
        else if (nodeData.class == "priSpace") {
          this.dynComponent = 'host'
          this.$store.commit('SET_BASEPHONE', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'host')
        }
        else if (nodeData.class == "手机相关设置") {
          this.dynComponent = 'proofInfo'
          this.$store.commit('SET_BASEPHONE', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'proofInfo')
        }
        else if (nodeData.class == 'phone_images' || nodeData.class == 'phone_file' || nodeData.class == 'phone_downloads' || nodeData.class == 'phone_video' || nodeData.class == 'phone_audio') {
          this.dynComponent = 'phoneDetail'
          this.$store.commit('SET_BASEPHONE', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'phoneDetail')
        }
        // else if (nodeData.class == 'audioAPP') {
        //   this.dynComponent = 'playVideo'
        //   this.$store.commit('SET_PLAYVIDEO', Date.parse(new Date()))
        //   this.sendData = nodeData
        //   sessionStorage.setItem('item1', 'playVideo')
        // }
        // else if (nodeData.class == 'shootAPP') {
        //   this.dynComponent = 'playVideo'
        //   this.$store.commit('SET_PLAYVIDEO', Date.parse(new Date()))
        //   this.sendData = nodeData
        //   sessionStorage.setItem('item1', 'playVideo')
        // }
        // else if(nodeData.class=="payAPP"){
        //   this.dynComponent='newOtherApp'
        //   this.$store.commit('SET_BASEPHONE',Date.parse(new Date()))
        //   this.sendData=nodeData
        //   sessionStorage.setItem('item1','newOtherApp')
        // }
        //qq同步助手
        else if (nodeData.class == "emailAPP") {
          this.dynComponent = 'qqSync'
          this.$store.commit('SET_QQSYNC', Date.parse(new Date()))
          this.sendData = nodeData
          sessionStorage.setItem('item1', 'qqSync')
        }
      },
    },
  };
  </script>
  
  <style lang="scss" scoped>
  .zhizhen {
  
    position: relative;
    top: 100px;
    animation: float 2s infinite;
  }
  
  @keyframes float {
    0% {
      transform: translateY(0);
    }
  
    50% {
      transform: translateY(-10px);
    }
  
    100% {
      transform: translateY(0);
    }
  }
  
  .dateTime {
    position: relative;
    top: 47px;
    left: 55px;
    font-weight: bold;
    color: #000;
  }
  
  #bgPhone {
    // border: 1px  solid red;
    border: 1px solid #fff;
    // width: 450px;
    height: 98%;
    // background: url('../../assets/bgPhone/phone.png') no-repeat 0 0px;
    background-size: 100% 100%;
    margin: 0 auto;
  }
  
  // .el-icon-arrow-right{
  //   height: 20px;
  // }
  .close {
    position: absolute;
    top: -7px;
    right: 0px;
    font-size: 29px;
    font-weight: bold;
    width: 29px;
    height: 29px;
    z-index: 1002;
    color: #9f9898;
    cursor: pointer;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
  }
  
  .close:hover {
    // box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5);
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    color: #474747;
    // transform: rotate(360deg);
  }
  
  
  .menuInfoList {
    width: 452px;
    margin-top: 5px;
    margin-left: 5px;
    margin-bottom: 5px;
    font-size: 12px;
    position: relative;
    z-index: 1001;
    height:15px
  }
  
  .choose {
    position: absolute;
    right: 10px;
  }
  
  .zujian {
    // border: 1px solid red;
    margin: 0;
    // height:89%;
    height: 870px;
    margin: 0 auto;
    // margin-top: 5%;
    // border-bottom-left-radius: 49px;
    // border-bottom-right-radius: 49px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    overflow: hidden;
  }
  
  .borderBox {
    position: absolute;
    bottom: 20px;
    z-index: 100;
  }
  
  .dashboard-container {
    width: 500px;
    height: 100%;
    padding: 10px 10px 10px 25px;
    justify-content: space-between;
    // overflow-x: auto;
    position: relative;
  }
  
  .areaBox {
    position: relative;
    border: 2px dashed rgb(196, 196, 196);
    // height: 97.5%;
    height: 100%;
    border-radius: 5px;
  }
  
  .areaBoxACTIVE {
    position: relative;
    // border: 1px solid rgba(237, 237, 237, 0.7);
    height: 100%;
    border-radius: 5px;
    margin-right: 20px;
    box-shadow: 0 4px 30px rgba(4, 178, 247, 0.22), 0 0 6px rgba(4, 109, 247, 0.4);
  
    background: linear-gradient(90deg, #787878 50%, transparent 0) repeat-x,
      linear-gradient(90deg, #787878 50%, transparent 0) repeat-x,
      linear-gradient(0deg, #787878 50%, transparent 0) repeat-y,
      linear-gradient(0deg, #787878 50%, transparent 0) repeat-y;
    background-size: 10px 2px, 10px 2px, 2px 10px, 2px 10px;
    background-position: 0 0, 0 100%, 0 0, 100% 0;
    animation: div2Ani 1200ms infinite linear;
  
  }
  
  @keyframes div2Ani {
    100% {
      background-position: 10px 0, -10px 100%, 0 -10px, 100% 10px;
    }
  }
  
  @media screen and (min-width: 2360px) {
    .menuInfoList {
      width: 480px;
      margin-top: 5px;
      margin-left: 5px;
      margin-bottom: 5px;
      font-size: 12px;
      position: relative;
      z-index: 1001;
    }
  
    .dashboard-container {
      width: 500px;
      height: 950px;
      padding: 10px 10px;
      display: flex;
    }
  
    .zujian {
      margin: 0;
      height: 870px;
      width: 98%;
      margin: 0 auto;
      margin-top: 1%;
      border-top-left-radius: 4px;
      border-top-right-radius: 4px;
      overflow: hidden;
    }
  
    .areaBoxACTIVE {
      position: relative;
      height: 99%;
      border-radius: 5px;
      box-shadow: 0 4px 30px rgba(4, 178, 247, 0.22),
        0 0 6px rgba(4, 109, 247, 0.4);
      // overflow-y:auto;
      // overflow: hidden;
    }
  
    .areaBox {
      position: relative;
      border: 2px dashed rgb(192, 192, 192);
      // height: 98vh;
      height: 99%;
      border-radius: 5px;
  
  
    }
  
    #bgPhone {
      border: 1px solid #fff;
    //   width: 550px;
      height: 98%;
      // background: url('../../assets/bgPhone/phone.png') no-repeat 0 0px;
      background-size: 100% 100%;
      margin: 0 auto;
    }
  }
  
  @media (min-width: 2360px) and (max-width: 2560px) {
    .dashboard-container {
      width: 500px;
      height: 95vh;
      padding: 10px 10px;
      display: flex;
    }
  
    .zujian {
      margin: 0;
      height: 89vh;
      margin: 0 auto;
      border-top-left-radius: 4px;
      border-top-right-radius: 4px;
      overflow: hidden;
    }
  }
  
  // dashboard-container
  @media screen and (min-width: 2561px) {
    .dashboard-container {
      width: 500px;
      height: 80vh;
      padding: 10px 10px;
      display: flex;
    }
  
    .zujian {
      margin: 0;
      height: 75vh;
      margin: 0 auto;
      border-top-left-radius: 4px;
      border-top-right-radius: 4px;
      overflow: hidden;
    }
  }
  
  /* 屏幕分辨率放大为 150 */
  // @media (-webkit-min-device-pixel-ratio: 1), (min-resolution: 120dpi) {
  //   .dashboard-container {
  //     height: 80vh;
  //     padding: 10px 10px;
  //     display: flex;
  //   }
  //   .zujian {
  //     margin:0;
  //     height:75vh;
  //     margin:0 auto;
  //     border-top-left-radius: 4px;
  //     border-top-right-radius: 4px;
  //     overflow: hidden;
  // }
  // }
  </style>
  